{% extends 'main.html' %}

{% block content %}

<main class="layout">

      <div class="container">

        <div class="layout__box">

          <div class="layout__boxHeader">

            <div class="layout__boxTitle">

              <a href="{% url 'home' %}">  {# 返回箭头 -> #}
                <svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
                  <title>arrow-left</title>
                  <path
                    d="M13.723 2.286l-13.723 13.714 13.719 13.714 1.616-1.611-10.96-10.96h27.625v-2.286h-27.625l10.965-10.965-1.616-1.607z"
                  ></path>
                </svg>
              </a>

              <h3>最近活跃...</h3>

            </div>

          </div>

          {# 展示最新消息 start #}
          <div class="activities-page layout__body">

            {% for message in room_messages %}
            <div class="activities__box">
                <div class="activities__boxHeader roomListRoom__header">

                    <a href="{% url 'user-profile' message.user.id %}" class="roomListRoom__author">
                        <div class="avatar avatar--small">
                            <img alt="" src="{{ message.user.avatar.url }}"/>
                        </div>
                        <p>@{{ message.user.username }}<span>{{ message.created|timesince }}前...</span></p>
                    </a>

                    {% if request.user == message.user %}
                    <div class="roomListRoom__actions">
                        <a href="{% url 'delete-message' message.id %}">
                            <svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32"
                                 viewBox="0 0 32 32">
                                <title>删除消息</title>
                                <path
                                        d="M27.314 6.019l-1.333-1.333-9.98 9.981-9.981-9.981-1.333 1.333 9.981 9.981-9.981 9.98 1.333 1.333 9.981-9.98 9.98 9.98 1.333-1.333-9.98-9.98 9.98-9.981z"
                                ></path>
                            </svg>
                        </a>
            </div>
            {% endif %}

        </div>

        <div class="activities__boxContent">
            <p>回复“<a href="{% url 'room' message.room.id %}">{{ message.room }}</a>”</p>
            <div class="activities__boxRoomContent">
                {{ message }}
            </div>
        </div>
    </div>
            {% endfor %}

          </div>
          {# 展示最新消息 end #}


        </div>

      </div>

</main>

{% endblock content %}

